import React, { Component } from 'react'
import { Anchor } from 'antd'
import styles from './index.module.scss'
import anchorTitleSvg from 'assets/IconSvg/sprite.svg'
const { Link } = Anchor

export default class PageAnchor extends Component {
  constructor(props) {
    super(props)
    this.state = {}
  }
  componentDidMount() {
    // console.log('anchorBox', this.props.anchorBox)
  }
  stopAnchorClick = (e) => {
    e.preventDefault() // 阻止链接跳转行为
  }
  render() {
    return (
      <div className={styles.anchorComSty}>
        <div className={styles.anchorContent}>
          <div className={styles.anchorImgBox}>
            <img src={anchorTitleSvg} alt="" />
          </div>
          <Anchor
            onClick={this.stopAnchorClick}
            getContainer={() => this.props.anchorBox.current}
            affix={false}
            className={styles.anchorValueBox}
          >
            {this.props.anchorInfoArr !== []
              ? this.props.anchorInfoArr.map((item) => (
                  <Link href={item.link} title={item.title} />
                ))
              : ''}
          </Anchor>
        </div>
      </div>
    )
  }
}
